<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<!DOCTYPE html>
<html>
<head>
<!-- 启动网址：http://localhost:8080/shop_manage/page/login.jsp -->
	<meta charset="utf-8">
	<title>登陆页</title>
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/layui/css/layui.css">
	<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
	<script>
		L2Dwidget.init({
	        "model": {
	            jsonPath: "https://unpkg.com/live2d-widget-model-miku@1.0.5/assets/miku.model.json",
	            "scale": 1
	        },
	        "display": {
	            "position": "left",
	            "width": 250,
	            "height": 500,
	            "hOffset": 0,
	            "vOffset": -20
	        },
	        "mobile": {
	            "show": true,
	            "scale": 0.5
	        },
	        "react": {
	            "opacityDefault": 0.3,
	            "opacityOnHover": 0.2
	        }
	    });
	</script>
	<style>
			.demo1{
			width: 500px;
			height: 300px;
			line-height: 50px;
			text-align: center;
		}
		.demo1:before{
			background: url(../img/miku.jpeg) no-repeat;
			background-size: cover;
			width: 500px;
			height: 300px;
			content: "";
			position: absolute;
			top: 0;
			left: 0;
			z-index: -1;
			-webkit-filter: blur(3px);
			filter: blur(3px);
		}

		.demo2-bg{
			background: url(../img/miku.jpeg) no-repeat fixed;
			background-size: cover;
			width: 100%;
			height: 100%;
			position: relative;
		}
		.demo2{
			left: 0;
			right: 0;
			top: 0;
			bottom: 0;
			width: 100%;
			height: 100%;
			text-align: center;
			background:rgba(255,255,255,0.3);
		}
		</style>
</head>
<body class="demo2-bg" style="font-family: '微软雅黑';">
	<script type="text/javascript">
		    ! function () {
		        function o(w, v, i) {
		            return w.getAttribute(v) || i
		        }
		
		        function j(i) {
		            return document.getElementsByTagName(i)
		        }
		
		        function l() {
		            var i = j("script"),
		                w = i.length,
		                v = i[w - 1];
		            return {
		                l: w,
		                z: o(v, "zIndex", -1),
		                o: o(v, "opacity", 0.5),
		                c: o(v, "color", "0,0,0"),
		                n: o(v, "count", 99)
		            }
		        }
		
		        function k() {
		            r = u.width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth, n = u.height = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight
		        }
		
		        function b() {
		            e.clearRect(0, 0, r, n);
		            var w = [f].concat(t);
		            var x, v, A, B, z, y;
		            t.forEach(function (i) {
		                i.x += i.xa, i.y += i.ya, i.xa *= i.x > r || i.x < 0 ? -1 : 1, i.ya *= i.y > n || i.y < 0 ? -1 : 1, e.fillRect(i.x - 0.5, i.y - 0.5, 1, 1);
		                for (v = 0; v < w.length; v++) {
		                    x = w[v];
		                    if (i !== x && null !== x.x && null !== x.y) {
		                        B = i.x - x.x, z = i.y - x.y, y = B * B + z * z;
		                        y < x.max && (x === f && y >= x.max / 2 && (i.x -= 0.03 * B, i.y -= 0.03 * z), A = (x.max - y) / x.max, e.beginPath(), e.lineWidth = A / 2, e.strokeStyle = "rgba(" + s.c + "," + (A + 0.2) + ")", e.moveTo(i.x, i.y), e.lineTo(x.x, x.y), e.stroke())
		                    }
		                }
		                w.splice(w.indexOf(i), 1)
		            }), m(b)
		        }
		        var u = document.createElement("canvas"),
		            s = l(),
		            c = "c_n" + s.l,
		            e = u.getContext("2d"),
		            r, n, m = window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function (i) {
		                window.setTimeout(i, 1000 / 45)
		            },
		            a = Math.random,
		            f = {
		                x: null,
		                y: null,
		                max: 20000
		            };
		        u.id = c;
		        u.style.cssText = "position:fixed;top:0;left:0;z-index:" + s.z + ";opacity:" + s.o;
		        j("body")[0].appendChild(u);
		        k(), window.onresize = k;
		        window.onmousemove = function (i) {
		            i = i || window.event, f.x = i.clientX, f.y = i.clientY
		        }, window.onmouseout = function () {
		            f.x = null, f.y = null
		        };
		        for (var t = [], p = 0; s.n > p; p++) {
		            var h = a() * r,
		                g = a() * n,
		                q = 2 * a() - 1,
		                d = 2 * a() - 1;
		            t.push({
		                x: h,
		                y: g,
		                xa: q,
		                ya: d,
		                max: 6000
		            })
		        }
		        setTimeout(function () {
		            b()
		        }, 100)
		    }();
		</script>
	<div class="demo2" >
			
		<div class="layui-main" style="margin: 200px auto 0 auto;width:30%; height:200px;">
			<div class="layui-panel">
			    <div align="center" style="margin-top: 10px;">
					<span class="layui-font-20">企业管理系统</span>
			    </div>
			    <div class="layui-form-item" style="margin: 10px auto;width: 90%;">
			      	<input type="text" class="layui-input" placeholder="请输入手机号" required id="phone"/>
			      	<input type="password" class="layui-input" placeholder="请输入密码" required id="pass"/>
			      	<button type="button" class="layui-btn layui-btn-normal layui-btn-fluid" onclick="login();">
						登录
					</button>
			    </div>
			</div>   
		</div>
	</div>
</body>
<script src="${pageContext.request.contextPath}/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">

	function login(){
		var phone = $("#phone").val();
		var pass = $("#pass").val();
		//ajax:jquery发送http请求的方式
		$.ajax({
			//提交的url路径
			url:"http://localhost:8080/shop_manage/st",
			//提交的参数
			data:{"method":"login", "phone":phone, "pass":pass},
			//返回值数据类型
			dataType:"text",
			//提交方式：post
			type:"POST",
			//发送请求成功之后的回调函数
			success:function(str){
				console.info(str);
				if(str == '1'){
					alert("登录成功");
					//跳转到主页
					window.location.href="http://localhost:8080/shop_manage/st?method=mainPage";
				} else {
					alert("登录失败");
				}
			},
			error:function(){
				
			}
		});
	}

</script>
</html>
